/**
 * 初始化生成树形结构的函数
 */
function generateTree() {
// 1、准备生成树形结构的JSON数据，通过发送ajax请求获取数据
    $.ajax({
        "url": "menu-get-tree.json",
        "type": "post",
        "dataType": "json",
        "success": function (response) {
            var result = response.result;
            if (result == "SUCCESS") {

                // 2、创建JSON对象用于存储对zTree所做的设置
                var setting = {
                    "view": {
                        "addDiyDom": myAddDiyDom,
                        "addHoverDom": myAddHoverDom,
                        "removeHoverDom": myRemoveHoverDom
                    },
                    "data": {
                        "key": {
                            "url": "mao"            // 点击节点不跳转
                        }
                    }
                };

                // 3、从响应体中获取JSON数据
                var zNodes = response.data;

                // 4、初始化树形结构
                $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            }

            if (result == "FAILED") {
                layer.msg(response.message);
            }
        }
    });
}


/**
 * 当鼠标移除节点的范围时删除按钮组
 * @param treeId
 * @param treeNode
 */
function myRemoveHoverDom(treeId, treeNode) {

    // 拼接按钮组的id
    var btnGroup = treeNode.tId + "_btnGroup";

    // 删除相应的按钮组
    $("#" + btnGroup).remove();
}


/**
 * 当鼠标出现在节点的范围内时添加按钮组
 * @param treeId
 * @param treeNode
 */
function myAddHoverDom(treeId, treeNode) {

    // 按钮组标签的结构：<span><a><i></i></a><a><i></i></a></span>
    // 按钮组出现的位置在 节点treeDemo_n_a超链接 的后面

    // 为了后面移除span操作方便，为span标签添加有规律的id
    var btnGroup = treeNode.tId + "_btnGroup";


    // 判断是否已经添加过按钮组，已添加过一次将不再添加
    if ($("#" + btnGroup).length > 0) {
        return;
    }

    // 将要添加的按钮的HTML标签准备好
    var addBtn = "<a id='" + treeNode.id + "' class='addBtn btn btn-info dropdown-toggle btn-xs' style='margin-left:10px;padding-top:0px;' href='#' title='添加子节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-plus rbg '></i></a>";
    var removeBtn = "<a id='" + treeNode.id + "' class='removeBtn btn btn-info dropdown-toggle btn-xs' style='margin-left:10px;padding-top:0px;' href='#' title='删除节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-times rbg '></i></a>";
    var editBtn = "<a id='" + treeNode.id + "' class='editBtn btn btn-info dropdown-toggle btn-xs' style='margin-left:10px;padding-top:0px;' href='#' title='修改节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-edit rbg '></i></a>";

    // 声明变量存储拼装好的按钮组
    var btnHtml = "";

    // 获取当前节点的级别
    var level = treeNode.level;

    // 判断当前节点的级别
    if (level == 0) {
        // 级别为0：根节点，只能添加子节点
        btnHtml = addBtn;
    }

    // 级别为1：子节点
    if (level == 1) {
        // 当前节点有子节点只能修改、添加
        btnHtml = editBtn + " " + addBtn;

        // 获取当前节点的子节点的数量
        var length = treeNode.children.length;

        // 判断当前节点是否有子节点
        if (length == 0) {
            // 没有子节点，可以删除、修改、添加
            btnHtml = btnHtml + " " + removeBtn;
        }
    }

    // 级别为2：叶子节点
    if (level == 2) {

        // 叶子节点只能修改、删除
        btnHtml = editBtn + " " + removeBtn;
    }

    // 找到附着按钮的超链接
    var anchorId = treeNode.tId + "_a";

    // 执行在超链接后面附加span的操作
    $("#" + anchorId).after("<span id='" + btnGroup + "'>" + btnHtml + "</span>");
}


/**
 * 修改默认的图标
 * @param treeId 整个树形结构所依附的ul标签的id
 * @param treeNode 当前树节点的全部数据，包括从后端查询得到的Menu对象的全部属性
 */
function myAddDiyDom(treeId, treeNode) {

    // treeId 是整个树形结构所依附的ul标签的id
    console.log("treeId=" + treeId);

    // treeNode 是当前树节点的全部数据，包括从后端查询得到的Menu对象的全部属性
    console.log(treeNode);

    // zTree id 生成的规则
    // 例子：treeDemo_2_ico
    // 解析：ul标签的id_当前节点的序号_功能
    // 提示：“ul标签的id_当前节点的序号” 部分可以访问 treeNode 的 tId 属性得到
    // 根据id的生成规则拼接出来span的id
    var spanId = treeNode.tId + "_ico";

    // 根据控制图标的 span 标签的 id 找到这个 span 标签
    // 删除旧的class
    // 添加新的class
    $("#" + spanId).removeClass().addClass(treeNode.icon);
}